<!doctype html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <title>没事编着玩</title>
    <script type="text/javascript" src="/js/jquery-2.0.3.min.js"></script>
    <link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/css/tabPlay.css">
    <link rel="stylesheet" type="text/css" href="/css/indexPage.css">

    <!--[if lt IE 9]>
    <script src="/js/jquery-1.11.1.js"></script>
    <script src="/js/html5shiv.js"></script>
    <script src="/js/respond.min.js"></script>
    <![endif]-->
    <script type="text/javascript" src="/js/bootstrap.min.js"></script>

</head>
<body>
<input type="text" class="hidden" name="logined" id="userLoginFlag" value="<%if(user&& user.id){%>true<%}%>">
<div class="container">
    <div class="row">
        <div class="col-sm-12" style="text-align:center;">
            1.针对html5进行的页面编写,并尽量兼容ie<br>
            2.仅仅是demo，除了返回的错误，其他的错误均未处理
        </div>
    </div>
    <div class="row">
        <div class="col-sm-3 col-xs-3">
            <div class="panel-group" id="accordion">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <h4 class="panel-title">
                            <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
                                邮件
                            </a>
                        </h4>
                    </div>
                    <div id="collapseOne" class="panel-collapse collapse ">
                        <div class="panel-body">
                            <a href="javascript:void(0);" id="sendMailer" class="rightChange">发送邮件</a>
                        </div>
                    </div>
                </div>
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <h4 class="panel-title">
                            <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
                                文件
                            </a>
                        </h4>
                    </div>
                    <div id="collapseTwo" class="panel-collapse collapse">
                        <div class="panel-body">
                            <a href="javascript:void(0);" id="filePrewiew" class="rightChange">预览</a>
                        </div>
                        <div class="panel-body">
                            <a href="javascript:void(0);" id="fileUpload" class="rightChange">上传</a>
                        </div>
                    </div>
                </div>
            </div>

        </div>
        <div class="col-sm-9 col-xs-9">
            <div class="tab <%if(!!user && user.name){%>hidden<%}%>">
                <ul id="tabs">
                    <li id=""><a href="#" title="tab1">登录</a></li>
                    <li id=""><a href="#" title="tab2">注册</a></li>
                </ul>
                <div id="content">
                    <div id="tab1" style="display: block;">
                        <div class="row">
                            <div class="col-sm-3 col-xs-4">用户名</div>
                            <div class="col-sm-9 col-xs-8">
                                <input type="text" name="name" class="form-control">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3 col-xs-4">密码</div>
                            <div class="col-sm-9 col-xs-8">
                                <input type="text" name="password" onfocus="javascript:this.type='password'"
                                       class="form-control">
                            </div>
                        </div>
                    </div>
                    <div id="tab2" style="display: none;">
                        <div class="row">
                            <div class="col-sm-3 col-xs-4">用户名</div>
                            <div class="col-sm-9 col-xs-8">
                                <input type="text" name="name" class="form-control">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3 col-xs-4">密码</div>
                            <div class="col-sm-9 col-xs-8">
                                <input type="text" name="password" onfocus="javascript:this.type='password'"
                                       class="form-control">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3 col-xs-4">重复密码</div>
                            <div class="col-sm-9 col-xs-8">
                                <input type="text" name="password2" onfocus="javascript:this.type='password'"
                                       class="form-control">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <input type="button" class="btn btn-default submitBtn <%if(!!user && user.name){%>hidden<%}%>" value="提交">
            <iframe frameborder=0 scroll="no" id="mainIframe" style="<%if(!user ){%>display: none;<%}%>min-height: 500px;">

            </iframe>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12" style="text-align:center;">
            分栏测试 foot
        </div>
    </div>
</div>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    警告！
                </h4>
            </div>
            <div class="modal-body">

            </div>
            <div class="modal-footer text-center">
                <button type="button" class="btn btn-default" data-dismiss="modal">知道了</button>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript" src="/js/indexPage.js"></script>
</body>
</html>